<template>
  <div class="info-page">
    <div class="head">
      <div class="back" @click="back">
        <img src="../../assets/image/ic_back_black.png" alt="" />
      </div>
      <div class="title">资讯列表</div>
    </div>
    <div class="consult-box" style="padding-bottom: 0.5rem">
      <div
        class="consult-conter"
        @click="toArticle(item.id)"
        v-for="(item, index) in consultList"
        :key="index"
      >
        <div class="conter-left">
          <div class="title">{{ item.title }}</div>
          <div class="jituan">
            <span class="jts">{{ item.addtime | formatDate3 }}</span>
            <span></span>
          </div>
        </div>
        <div class="conter-right">
          <img :src="Config_ysy.img_url + item.a_image" alt="" />
          <p class="check">查看详情>>></p>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import { formatDate } from "../../untils/date";
import { consultData } from "../../sever/request";
export default {
  data() {
    return {
      consultList: [],
      token: "123",
      shop_id:131
    };
  },
  filters: {
    formatDate(time) {
      var date = new Date(time);
      return formatDate(date, "yyyy.MM.dd");
    },
    formatDate2(time) {
      var date = new Date(time);
      return formatDate(date, "hh:mm:ss");
    },
    formatDate3(time) {
      time = time * 1000;
      var date = new Date(time);
      return formatDate(date, "yyyy年MM月dd日 hh:mm:ss");
    },
  },
  moutend() {
    let store = this.$route.query;
    if (store.shop_id != undefined) {
      this.shop_id = store.shop_id;
    }
    if (store.token != "" && store.token != undefined) {
      this.token = store.token;
    }
  },
  created() {
     let store = this.$route.query;
      if (store.shop_id != undefined) {
        this.shop_id = store.shop_id;
      }
      if (store.token != "" && store.token != undefined) {
        this.token = store.token;
      }
    this.getConsult();
  },
  methods: {
    back() {
      this.$router.go(-1);
    },
    toArticle(id) {
      this.$router.push({
        path: "../article",
        query: { token: this.token, id: id },
      });
    },
    getConsult() {
      consultData({
        token: this.token,
        shop_id:this.shop_id
      }).then((res) => {
        if (res.data.code === 1) {
          this.consultList = res.data.data;
        }
      });
    },
  },
};
</script>
<style lang="less" scoped>
.info-page {
  width: 10rem;
  .head {
    width: 10rem;
		padding: .933333rem 0 .266667rem;
		background-color: #FFFFFF;
		box-shadow: 0px .106667rem .213333rem rgba(0, 0, 0, 0.08);
		position: fixed;
		top: 0;
		left: 0;
		z-index: 10;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    .back {
      margin: 0 0 0 0.266667rem;
      img{
            width: .266667rem;
            height: .4rem;
        }
    }
    .title {
           font-size: .4rem;
            color: #333;
            font-weight: 600;
            margin-left: 3.6rem;
    }
  }
  .consult-box {
    width: 10rem;
    margin-top: 2.066667rem;
    .consult-conter {
      width: 9.68rem;
      height: 2.333333rem;
      box-shadow: 0.026667rem -0.013333rem 0.04rem 0px rgba(51, 44, 42, 0.41);
      border-radius: 0.133333rem;
      border: solid 1px #a7a7a7;
      margin: 0 0.16rem 0.273333rem 0.16rem;
      display: flex;
      justify-content: space-between;
      .conter-left {
        padding: 0.48rem 0 0 0.24rem;
        .title {
          font-size: 0.32rem;
          font-weight: bold;
          color: #555555;
        }
        .jituan {
          margin-top: 0.586667rem;
          .jts {
            font-size: 0.213333rem;
            color: #a9adae;
          }
        }
      }
      .conter-right {
        margin: 0.186667rem;
        width: 3.56rem;
        height: 2rem;
        position: relative;
        img {
          width: 3.56rem;
          height: 2rem;
        }
        .check {
          position: absolute;
          bottom: 0px;
          width: 3.56rem;
          height: 0.346667rem;
          text-align: center;
          line-height: 0.346667rem;
          font-size: 0.213333rem;
          color: #4d4d4d;
          font-weight: bold;
          background-color: #dededd;
          opacity: 0.63;
        }
      }
    }
  }
}
</style>